import React, { Component } from 'react'

/*
  API 接口说明
  data: Array，必填;
  right: (props: any) => element
*/
export default class TodoList extends Component {
  render() {
    const { data } = this.props;

    // 列表渲染
    const lis = data.map(item => {
      return (
        <div className='todo-item' key={item.id}>
          <div className='todo-item-text'>{item.text}</div>
          <div>{this.props.right && this.props.right(item)}</div>
        </div>
      )
    })
    return (
      <div className='todo-list'>
        {lis}
      </div>
    )
  }
}
